<template>
  <div class="flex flex_column">

    <!--彩稿订单 -->
    <el-dialog
      append-to-body
      title="选择订单"
      :visible.sync="isVisible"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="70%"
      @close="closeMarDialog"
      @open="openDialog"
    >
      <div class="dialogDody marDialog flex flex_column">
        <div class="btnCon flex flex_between" style="border-bottom:none">
          <!--      搜索框-->
          <div class="search">
            <el-input
              v-model="materalSearch.likeWords"
              prefix-icon="el-icon-search"
              placeholder="输入关键字"
              size="small"
              @keyup.enter.native="MarterdialogShow"
            >
            </el-input>
          </div>
        </div>
        <!-- 表格区域       -->
        <div class="tableCon not pt0" style="padding: 16px">
          <el-table :data="materialList" border style="width: 100%" v-loading="marLoading">
            <el-table-column prop="xieYiShuHao" width="150" label="业务单号" />
            <el-table-column prop="orderProductName" width="150" show-overflow-tooltip label="产品名称" />
            <el-table-column prop="productSize" label="产品尺寸" />
            <el-table-column prop="printingSurface" label="版面" />
            <el-table-column prop="productVersions" label="版本" />
            <el-table-column prop="openOrderDate" label="开单日期">
              <template slot-scope="{row}">
                {{ parseTime(row.openOrderDate,'{y}-{m}-{d}') }}
              </template>
            </el-table-column>
            <el-table-column prop="expectedDeliveryTime" label="交货日期">
              <template slot-scope="{row}">
                {{ parseTime(row.expectedDeliveryTime,'{y}-{m}-{d}') }}
              </template>
            </el-table-column>
            <el-table-column prop="producePeriod" label="生产周期" />
            <el-table-column width="105" prop="deliveryBalanceDays" label="交货剩余天数" />
            <el-table-column width="150" show-overflow-tooltip prop="customerName" label="所属客户" />
            <el-table-column prop="salesmanName" label="业务员" />
            <el-table-column
              label="操作"
              width="100px"
              fixed="right"
              align="center"
            >
              <template slot-scope="scope">
                <el-button
                  type="text"
                  size="medium"
                  style="color: #606266"
                  @click="saveColorManuscript(scope.row)"
                >
                  选择
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>

import { parseTime } from '@/utils'

export default {
  name: 'SelectOrderList',
  props: {
    perVisible: {
      type: Boolean,
      required: false
    }
  },
  data() {
    return {
      materialList: [
      ], // 订单列表
      templateSelection: {},
      radio: '',
      materalSearch: {
        likeWords: ''
      }, // 彩稿列表明细搜索条件
      radioSelect: null,
      currentRow: null,
      marLoading: false,
      addLoading: false,
      loading:false,
    }
  },
  computed: {
    isVisible: {
      get() {
        return this.perVisible
      },
      set(val) {
        this.$emit('update:perVisible', val)
      }
    }
  },
  created() {
    // this.MarterdialogShow()
  },
  mounted() {},
  methods: {
    parseTime(time, cFormat) {
      return parseTime(time, cFormat)
    },
    openDialog() {
      this.openDialog.likeWords = ''
      this.MarterdialogShow()
    },
    getCurrentRow(row) {
      // 获取选中数据   row表示选中这一行的数据，可以从里面提取所需要的值
      this.templateSelection = row
    },

    // 关闭彩稿订单
    closeMarDialog() {
      this.isVisible = false
    },
    // 协议书号查找
    MarterdialogShow() {
      const parmas = this.materalSearch
      this.marLoading = true

      this.$api.business
        .GetMatchNoUploadColorDraftSaleOrders(parmas)
        .then((res) => {
          this.materialList = res
          this.marLoading = false
        })
        .catch(() => {})
    },
    saveColorManuscript(row) {
      this.$emit('current', row)
      this.isVisible = false
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
